<template>
	<view class="container">
		<view class="list-cell b-b m-t" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">头像</text>
			<image class="head_img" :mode="widthFix" :src="avatar || '../../static/image/bg_img.png'" @tap="uploadTap"></image>
		</view>
		<view class="list-cell b-b m-t" @click="prompt('修改昵称', 'nickname')" hover-class="cell-hover" :hover-stay-time="50">
			<text class="cell-tit">修改昵称</text>
			<text>{{nickname}}</text>
		</view>
		<prompt ref="prompt" @onConfirm="onConfirm" @onCancel="onCancel" title="提示"></prompt>
	</view>
	
</template>

<script>
	import prompt from './prompt'
	export default {
		components: {
			prompt
		},
		data() {
			return {
				popShow: false,
				title: '',
				key: '',
				tempFilePaths: "",
				alipayimg: "",
				img_hight:"",
				mod:false,
				widthFix: '',
				avatar:'',
				avatar1:'',
				nickname:''
			};
		},
		created() {
	
		},
		onShow() {
			this.$msgchat.initwork();
		},
		onLoad(option) {
			this.initDat();//初始化数据
		},
		methods:{
			initDat(){
				this.$common.requests('/api/index/userdetail',{uid: uni.getStorageSync('uid')}).then(res => {
					if(res.data.code == 1){
						this.nickname = res.data.data.nickname;
						if(res.data.data.avatar != ''){
							this.avatar = this.$common.baseUrl + res.data.data.avatar;
						}
						this.avatar1 = res.data.data.avatar;
					}
				})
			},
			uploadTap() {
				let that = this
				uni.chooseImage({
				  count: 1, //默认9
				  sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
				  sourceType: ['album'],
				  success: (chooseImageRes) => {
					that.tempFilePaths = chooseImageRes.tempFilePaths;
				
					uni.uploadFile({
					  url: this.$common.baseUrl + '/api/common/upload', //上传接口地址
					  filePath: that.tempFilePaths[0],
					  name: 'file',
					  enctype: "multipart/form-data",
					  formData: {
						mobile: that.phone
					  },
						success: (uploadFileRes) => {
							let res = JSON.parse(uploadFileRes.data);
							console.log(res.data.url);
							uni.setStorageSync('avatar', res.data.url);
							// that.avatar = configs.baseUrl + res.data.url.substr(1);
							that.avatar = this.$common.baseUrl + res.data.url;
							that.avatar1 = res.data.url;
							// that.alipayimg = that.baseurl + "/service" + res.data.alipayimg
							this.$common.requests('/api/user/profile',{avatar: res.data.url,nickname:this.nickname}).then(res => {
								this.$api.msg(res.data.msg);
							})
						}
					});
				
				  }
				});
			},
			prompt:function(){
				this.$refs.prompt.show();
			},
			onConfirm:function(e){
				let _cost = e;
				if (_cost == '') {
					console.log('你还未输入');
					return;
				}else{
					this.nickname = _cost;
					this.$common.requests('/api/user/profile',{avatar:this.avatar1,nickname: _cost}).then(res => {
						this.$api.msg(res.data.msg);
						uni.setStorageSync('nickname', _cost);
					})
					this.$refs.prompt.hide();
				}
			},
			onCancel:function(){
				this.$refs.prompt.hide();
				this.$refs.prompt.cost = '';
			}
		},
	}
</script>

<style lang='scss'>
	
	
	.list-cell{
		padding: 25upx 0 ;
		margin: 0 30upx;
		border-bottom: 1px solid #CCCCCC;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.head_img{
		width: 90upx;
		height:90upx;
		border-radius: 50%;
	}
</style>
